<script setup lang="ts">
import { time2str } from '@/widgets'
import { MapItemLink } from '@/map-item'
import type { Aircraft } from '../aircraft'
import { routingMapItem } from '../routing'
import { airportMapItem } from '../airport'
import { getAircraftFlightPlanInfo } from './fpl-index'
import { flightPlanMapItem } from './map-item'
const props = defineProps<{ type: string; item: Aircraft }>()

const fplLst = getAircraftFlightPlanInfo(props.item.id)
</script>
<template>
  <div class="ac-fpl-lst pane-block">
    <div class="map-block-header">
      <div>飞行计划[{{ fplLst?.length || 0 }}]</div>
    </div>
    <template v-if="fplLst && fplLst.length > 0">
      <div class="row">
        <div class="col-6em">Id</div>
        <div class="col-7em">飞行路线</div>
        <div class="col-6em">起飞机场</div>
        <div class="col-6em">落地机场</div>
        <div class="col-7em">开始时间</div>
      </div>
      <div class="row" v-for="fpl in fplLst">
        <MapItemLink class="col-6em" :txt="fpl.id" :item="flightPlanMapItem" />
        <MapItemLink class="col-7em" :txt="fpl.routing" :item="routingMapItem" />
        <MapItemLink class="col-6em" :item="airportMapItem" :txt="fpl.depApt" v-if="fpl.depApt" />
        <div v-else class="col-6em">-</div>
        <MapItemLink class="col-6em" :item="airportMapItem" :txt="fpl.arrApt" v-if="fpl.arrApt" />
        <div v-else class="col-6em">-</div>
        <div class="col-7em">{{ time2str(fpl.startTime) }}</div>
      </div>
    </template>
  </div>
</template>
<style lang="scss">
// @import '@/map/style/var';
// .ac-fpl-lst {
//   border-top: 1px solid $map-fg;
//   margin-top: 0.5em;
//   padding-bottom: 0.25em;
// }
</style>
